<ui:composition template="/template/template-professor.xhtml"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.org/ui"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:ui="http://java.sun.com/jsf/facelets">

    <ui:define name="corpo">
        <!--<p:panel style="font-size: 10px !important; margin-bottom: 5% !important;">
            Inserção dos dados -> <h:outputText style="color: #999999 !important;" value="Upload das fotos"/>
        </p:panel>-->
        <h:form id="pa">
            <p:growl id="message" showDetail="true" life="5000"/>
            
            <div style="margin-left: 30%; width: 500px !important; padding-bottom: 5% !important;">
                <p:panel style="margin-bottom:10px; display: table-cell; vertical-align: middle; font-size: 13px !important; background-color: #90b4bd">

                    <p:dataTable id="Fitop" var="fitop" value="#{cadastraFitoManagedBean.listFitop}" widgetVar="plantTable"
                                 emptyMessage="Não foram encontradas partes de planta" paginator="true" rows="10">

                        <p:column id="ativo" headerText="Disponível">
                            <p:commandButton value="Ativo" action="#{cadastraFitoManagedBean.changeDisponivelState(fitop)}" rendered="#{cadastraFitoManagedBean.isAtivo(fitop)}"/>
                            <p:commandButton value="Inativo" action="#{cadastraFitoManagedBean.changeDisponivelState(fitop)}" rendered="#{not cadastraFitoManagedBean.isAtivo(fitop)}"/>
                        </p:column>
                        
                        <p:column id="nomefp" headerText="Nome do Morfotipo" filterMatchMode="contains">
                            <h:outputText value="#{fitop.nomeFp}"/>
                        </p:column>

                        <p:column id="Seleção">
                            <p:commandButton icon="ui-icon-pencil" action="altera-fitop">
                                <f:setPropertyActionListener value="#{fitop}" target="#{cadastraFitoManagedBean.selectFitop}"/>
                            </p:commandButton>
                        </p:column>

                    </p:dataTable>

                    <p:separator />

                    <p:commandButton value="Novo" action="cadastrar-fitop"/>
                    <p:commandButton style="margin-bottom: 35px !important; margin-top: 20px !important;" value="Concluir" id="Submit"/>
                </p:panel>
            </div>
            <p:dialog>
                <p:selectOneMenu id="estado" value="#{cadastraFitoManagedBean.estado}" height="150" style="margin-bottom: 5px !important; width: 120px !important;">
                    <f:selectItem itemLabel="Estado" itemValue="" itemDisabled="true"/>
                    <f:selectItems value="#{cadastraFitoManagedBean.listEstado}"/>
                    <p:ajax update="Submit cidade"
                            listener="#{cadastraFitoManagedBean.fetchAllCidade()}"/>
                </p:selectOneMenu>
                <br/>
                <p:selectOneMenu id="cidade" value="#{cadastraFitoManagedBean.cidade}" height="150" style="margin-bottom: 5px !important; width: 120px !important;">
                    <f:selectItem itemLabel="Cidade" itemValue="" itemDisabled="true"/>
                    <f:selectItems value="#{cadastraFitoManagedBean.listCidade}"/>
                </p:selectOneMenu>
                <br/>

                <p:selectOneMenu id="csolo" value="#{cadastraFitoManagedBean.csolo}" height="150" style="margin-bottom: 5px !important; width: 120px !important;">
                    <f:selectItem itemLabel="Sibcs" itemValue="" itemDisabled="true"/>
                    <f:selectItems value="#{cadastraFitoManagedBean.listCsolo}"/>
                </p:selectOneMenu>

                <p:panelGrid columns="2">
                    <h:outputText value="Latitude"/>
                    <p:inputText id="latitude" value="#{cadastraFitoManagedBean.latitude}"/>
                    <h:outputText value="Longitude"/>
                    <p:inputText id="longitude" value="#{cadastraFitoManagedBean.longitude}"/>
                </p:panelGrid>

                <p:separator/>

                <h:outputText value="Retirada: "/>
                <p:inputMask id="Retirada" value="#{cadastraFitoManagedBean.retirada}" mask="99/99/9999"/> 
                <br/>
                <h:outputText value="Disponível para busca?" style="margin-right: 15px !important;"/>
                <p:selectBooleanCheckbox id="Disponivel" value="#{cadastraFitoManagedBean.disponivel}" style="margin-top: 15px !important;"/>

            </p:dialog>


        </h:form>
    </ui:define>
</ui:composition>